/*
 * MinIO Cloud Storage (C) 2016, 2018 MinIO, Inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

import React from "react"
import { connect } from "react-redux"
import logo1 from "../../img/logo1.svg"
import logo2 from "../../img/logo2.svg"
import logo3 from "../../img/logo3.svg"
import arrowl from "../../img/arrow-l.svg"
import wf from "../../img/wf.png"
import web from "../web"
import history from "../history"
import storage from 'local-storage-fallback'
import axios from "axios"

export class SwitchPage extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      discoveryDoc: {},
      clientId: "",
      buckets:"",
      url:"http://"+window.location.hostname+":18630/rest/v1/authentication/logout",
      formaction:"http://"+window.location.hostname+":8088/login/api",
      iframeState: false,
    }
  }


  jumpTo(x) {
    const { history } = this.props
    this.props.history.push(x)
  }
  openToSteamset() {
    window.open('http://'+window.location.hostname+':18630/j_security_check?j_username='+storage.getItem('uname')+'&j_password='+storage.getItem('pwd')+'&basePath=%2F&bucket='+this.state.buckets.join(","),"_self")
      // window.location.href='http://192.168.0.29:18630/j_security_check?j_username='+this.state.accessKeyLdap+'&j_password='+this.state.secretKeyLdap+'&basePath=%2F';
    const { history } = this.props
  }
  openToSuperset() {
    window.open('http://'+window.location.hostname+':18630/j_security_check?j_username='+this.state.accessKeyLdap+'&j_password='+this.state.secretKeyLdap+'&basePath=%2F',"_self")
      // window.location.href='http://192.168.0.29:18630/j_security_check?j_username='+this.state.accessKeyLdap+'&j_password='+this.state.secretKeyLdap+'&basePath=%2F';
    const { history } = this.props
  }
  toLogin(e) {
    // this.setState({
    //   iframeState: true,
    //   url:"",
    // })
    // setTimeout(()=>{
    //   this.setState({
    //     url : "http://192.168.0.29:18630/rest/v1/authentication/logout"
    //   })
    // },500)
    // document.getElementById("refreshAlarm").src="http://192.168.0.29:18630/rest/v1/authentication/logout"; 
    // document.frames("refreshAlarm").location.reload(true);
    // iframeid.window.location.reload()
    e.preventDefault()
    web.Logout()
    storage.getItem('uname')
    storage.getItem('pwd')
    history.replace("/login")
    // url: 'http://192.168.0.29:18630/j_security_check?j_username='+storage.getItem('uname')+'&j_password='+storage.getItem('pwd'),
    // window.open("http://192.168.0.29:18630/rest/v1/authentication/logout");
    // myWindow=window.open("http://192.168.0.29:18630/rest/v1/authentication/logout","","width=200,height=100");
    axios({
      method: 'get',
      url: "http://"+window.location.hostname+":18630/rest/v1/authentication/logout",
      headers: {'Content-Type': 'application/json','Access-Control-Allow-Origin':'*'},
      // data:{
      //     userName: storage.getItem('uname'),
      //     password: storage.getItem('pwd')
      // }
    })
    .then(
      (response)=>{
        console.log(response)
      }
    )
    .catch(
      (error)=>{
        console.log(error)
      }
    )
  }

  componentDidMount() {
    web.GetDiscoveryDoc().then(({ DiscoveryDoc, clientId }) => {
      this.setState({
        clientId,
        discoveryDoc: DiscoveryDoc,
        uname: storage.getItem('uname'),
        pwd: storage.getItem('pwd')
      })
    })
    web.ListBuckets().then(res => {
      this.state.buckets = res.buckets ? res.buckets.map(bucket => bucket.name) : []
    })
  }


  render() {
    return (
      <div className="switch">
        <img className="wf" src={wf} alt="" />
        <div className="banner">
          <h1>智能大数据存储管理平台</h1>
          <div className="banner-ct">
            <div className="banner-item" onClick={()=>this.openToSteamset()}>
              <div className="bg bg2">
                <img src={logo2} alt="" />
              </div>
              <div className="banner-content">
                <h2>数据集成</h2>
                <p className="banner-btn">点击进入</p>
                <img src={arrowl} alt="" />
              </div>
            </div>
            <div className="banner-item" onClick={()=>this.jumpTo("/")}>
              <div className="bg bg1">
                <img src={logo1} alt="" />
              </div>
              <div className="banner-content">
                <h2>数据存储</h2>
                <p className="banner-btn">点击进入</p>
                <img src={arrowl} alt="" />
              </div>
            </div>
            <div className="banner-item">
              <form class="hidden-form" action={this.state.formaction} target="_self" method="post" name="login">
                <input class="hidden-input" id="username" name="username"type="text" value={this.state.uname}></input>
                <input class="hidden-input" id="password" name="password"type="password" value={this.state.pwd}></input>
                <input class="hidden-submit" type="submit" value="登录"></input>
                <div className="bg bg3">
                  <img src={logo3} alt="" />
                </div>
                <div className="banner-content">
                  <h2>数据分析</h2>
                  <p className="banner-btn">点击进入</p>
                  <img src={arrowl} alt="" />
                </div>
              </form>
            </div>
          </div>
          <button className="tologin" onClick={this.toLogin.bind(this)}>返回登录页</button>
        </div>

      </div>
    )
  }
}

export default connect(
  state => state
)(SwitchPage)
